<template>
  <div>
    <div style="height:100%">
      <tab :line-width=2 active-color='#0076e4' v-model="select01">
        <tab-item :selected="select01 === index" v-for="(item, index) in list2"
                  @on-item-click="initData(count,select01)" :key="index">{{item}}
        </tab-item>
      </tab>

      <group>
        <cell :title="caseItem.caseName" :link="caseItem.url" :inline-desc="caseItem.time"
              v-for="(caseItem, index) in caseObj" :key="index"></cell>
      </group>

    </div>
    <div class="btn-box" v-show="isShow">
      <p class="loadingMore" @click="loadMore()" v-if="count<totalRow">加载更多</p>
      <p class="loadingMore" v-else>已加载全部</p>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
  import {Tab, TabItem, Group, Cell} from 'vux'

  const list = () => ['未提交', '办理中', '已办结', '已撤销'];
  export default {
    data() {
      return {
        list2: list(),
        select01: 0,
        count: 3,
        userguid: 'a91c5bfcc76a4c15a35ae9a6593dd126',
        // userguid: JSON.parse(localStorage.getItem('user')).guid,
        totalRow: '',
        caseObj: [
//          {
//            caseName: '无数据',
//            time: '无数据',
//            url: ''
//          }
        ],
        isShow: false,
      }
    },
    created() {
      this.initData(this.count, this.select01);
    },
    methods: {
      initData(val, sel) {
        let _self = this;
        console.log(sel);
        this.axios.get(global.baseApiUrl + '/tasks/page', {
        // this.axios.get('http://172.17.150.72:8111/tasks/page', {
          params: {
            ps: val,
            pi: '1',
            sb: 'creatordate',
            sd: 'desc',
            q_tskNum_s_eq: '',
            q_deleted_s_eq: 'N',
            q_creator_s_eq: _self.userguid,
            q_projectstatus_n_in: _self.select01 === 0 ? "'0'" : _self.select01 === 1 ? "'1','2','3'" : _self.select01 === 2 ? "'9','13'" : 'X'
          }
        })
          .then(function (response) {
            _self.caseObj = [];
            //console.log(response);
            let d = response.data.data.list;
            if (d.length > 0) {
              for (let i = 0; i < d.length; i++) {
                _self.$set(_self.caseObj, i, {
                  caseName: d[i].matName,
                  time: d[i].startDoDateStr,
                  url: _self.select01 === 0 ? d[i].apply_url + d[i].guid : '/user/user-matter/detail/' + d[i].tskNum
                });
              }
              _self.totalRow = response.data.data.totalRow;
              _self.isShow = true;
            }
//            else {
//              _self.$set(_self.caseObj, 0, {
//                caseName: '无数据',
//                time: '',
//                url: ''
//              });
//            }
          })
          .catch(function (response) {
            console.log(response);
          });
      },
      loadMore() {
        this.count += 3;
        this.initData(this.count);
      }
    },
    components: {
      Cell,
      Group,
      Tab,
      TabItem
    }
  }
</script>
<style rel="stylesheet/less" lang="less" scoped>
  .weui-cells__title {
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 0;
    margin-bottom: 0;
    background-color: #f5f5f5;
  }
</style>
